<template>
  <div class="conatiner">
    <div style="width: 100%; height: 5%; padding-left: 20px; padding-top: 20px">
      <breadcrumb :naviItems.sync="naviItems"></breadcrumb>
    </div>
    <regular-check-list
      v-if="showMode == 'list'"
      v-on:switchDetail="switchToDetail"
    ></regular-check-list>
    <regular-check-detail
      v-if="showMode == 'detail'"
      v-on:switchList="switchToList"
    ></regular-check-detail>
  </div>
</template>
<script>
import RegularCheckList from "./list";
import RegularCheckDetail from "./detail";
import { mapGetters } from "vuex";
import Breadcrumb from "../../../../components/QipingBreadCrumb/BreadCrumb.vue";
export default {
  data() {
    return {
      showMode: "list",
      naviItems: [
        { text: "起重机械" },
        { text: "数据仓储" },
        { text: "监控数据" },
      ],
    };
  },
  computed: {
    ...mapGetters(["selectedEqu"]),
  },
  created() {
    if (this.selectedEqu) {
      console.log("找到了vuex中的数据selectedEqu");
      this.switchToDetail();
    }
  },
  methods: {
    // 在List界面点击xxx份
    switchToDetail() {
      this.showMode = "detail";
    },
    // 在detail界面点击返回上一级，回到List界面
    // 之后加入分页相关数据
    switchToList() {
      this.showMode = "list";
    },
  },
  components: {
    RegularCheckList,
    RegularCheckDetail,
    Breadcrumb,
  },
};
</script>
<style lang="less" scoped>
</style>